<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
	<h1>Fantasy surf</h1>

    <div>
        <ul>
            <li><a href="/fb/">Profile</a></li>
            <li><a href="/fb/events/">Competitions</a></li>
            <li><a href="/fb/shop/">Shop</a></li>
        </ul>
    </div>

    <div>
        <h2>Upcoming Events</h2>
        <ul>
        	{% for event in events %}
        		<li>
        			<h3>{{event.name}}</h3> {{event.when}} {{event.location}}<br/>
        			<span>{{event.description}}</span><br/>
        			<img src="{{event.img}}" width="157px" height="118px" /><br/>
        			<div>Conditions</div>
			        <ul>
			            <li>Wave: {{event.conditions.wave}}</li>
			            <li>Wind: {{event.conditions.wind}}</li>
			            <li>Water temperature: {{event.conditions.wtemp}}</li>
			        </ul>
        			
        			<div><b>Participants</b>({{event.number_participants}})<br />
			        	<ul>
			        		{% for participant in event.participants %}
			        			<li>{{participant}}</li>
			        		{% endfor %}
			        	</ul>
        			</div>
        			<div>Prize:{{event.prize}} Participation fee:{{event.fee}}</div>
        			
        			{% if user_id in event.participants %}
        				<div>you are already signed up for this event. start waxing your board :)</div>
        			{% else %}
        				<div><a href="/fb/events/participate/{{event.id}}/">participate</a></div>
        			{% endif %}
    			</li>
        	{% endfor %}
        </ul>
    </div>    

</body>
</html>
